<template>
    <div id="great">
        <div id="builiding" style="overflow:hidden;">
            <iframe
                src="http://127.0.0.1:5501/index(initial).html"
                id="mobsf"
                style="position:relative;left:0px;top:0px;right:0px;bottom:0px;overflow:hidden;width:100%"
            ></iframe>
        </div>
    </div>
</template>

<script>
export default {
    name: 'xinwensulan.vue',
    data() {
        return {};
    },
    mounted() {
        /**
         * iframe-宽高自适应显示
         */
        function changeMobsfIframe() {
            const mobsf = document.getElementById('mobsf');
            const deviceWidth = document.body.clientWidth;
            const deviceHeight = document.body.clientHeight;
            mobsf.style.width = Number(deviceWidth) + 20 + 'px'; //数字是页面布局宽度差值
            mobsf.style.height = Number(deviceHeight) + 450 + 'px'; //数字是页面布局高度差
        }

        changeMobsfIframe();

        window.onresize = function() {
            changeMobsfIframe();
        };
    }
};
</script>

<style scoped>
.great {
    /* background:url("../assets/banner.jpg") no-repeat; */
    width: 1200px;
    height: 100%;
    position: fixed;
    background-size: 100% 100%;
    top: 0;
    border-width: 0 0 1px;
    overflow: hidden;
}
.building {
    width: 1200px;
    top: 0;
    border-width: 0 0 1px;
    overflow: hidden;
}
</style>
